.c7ncd-selfCode {
  background: #fff;
  padding: 20px 24px;
  padding-bottom: 10px;
  display: flex;
  flex-direction: column;

  &-scroll-bottom {
    width: 100%;
    margin: auto;
    text-align: center;
    color: var(--text-color3);
  }

  &-title {
    margin-bottom: 20px;
    margin-left: 5px;
    display: flex;

    span {
      font-size: 16px;
      font-weight: 500;
    }
  }

  &-content {
    padding-right: 2px;
    overflow: hidden;
    .infinite-scroll-component__outerdiv {
      width: 100%;
      ::-webkit-scrollbar {
        width: 2px;
      }
    }
  }

  &-item {
    display: flex;
    flex-direction: column;

    header {
      font-size: 13px;
      font-weight: 400;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;

      &:hover {
        text-decoration: underline;
        cursor: pointer;
      }
    }

    main {
      span {
        font-size: 12px;
        font-weight: 400;
        color: var(--text-color3);
      }
    }

    footer {
      margin-top: 8px;
      display: flex;
      align-items: center;
      font-size: 12px;
      font-weight: 400;
      color: var(--text-color3);
      white-space: nowrap;
      .c7ncd-test-user-info-wrap-name {
        max-width: 1.3rem;
        overflow: hidden;
        text-overflow: ellipsis;
      }
    }

    & + & {
      margin-top: 13px;
    }

    &::before {
      content: "";
      width: 100%;
      height: 1px;
      background: linear-gradient(
        to right,
        rgba(216, 220, 235, 0.4),
        rgba(216, 220, 235, 1),
        rgba(216, 220, 235, 0.4)
      );
      display: block;
      margin-bottom: 10px;
    }
  }
}
